// 需求1. 封装格式化时间函数，支持 Date 和 string 格式的时间，转换成功 `10:10:10` 时分秒
// 要求：
//     1. formatTime()  返回 当前时分秒，如： 18:18:10
//     2. formatTime('2023-02-01 10:10:10')  返回 时分秒，如： 10:10:10
const formatTime = (time?: string | Date) => {
  let _time: Date = new Date();
  // 不存在time
  if (!time) {
    _time = new Date();
  }

  if (typeof time === "string") {
    // 存在time
    _time = new Date(time);
  }

  if (typeof time == "object") {
    _time = time;
  }

  const h = _time.getHours();
  const m = _time.getMinutes();
  const s = _time.getSeconds();
  return `${h}:${m}:${s}`;
};

// 需求：去掉所有的any
const KEY = "ts-demo-data";
// 2.定义对象类型
type Item = {
  count: number;
  time: string;
};

const render = () => {
  const str = localStorage.getItem(KEY);
  // const list = JSON.parse(str);
  // 1. 去掉any后，使用逻辑或给parse传字符串数组
  const list: Item[] = JSON.parse(str || "[]");

  const lastItem = list[list.length - 1];
  list.push({
    // 要求：🔔 conut拼错了，要求报错，改为count
    //❌ conut: lastItem ? lastItem.count + 1 : 1,
    // 3. 修改conut 为count
    count: lastItem ? lastItem.count + 1 : 1,
    time: formatTime(),
  });

  localStorage.setItem(KEY, JSON.stringify(list));

  // 4. 去掉any ， as断言HTMLDivElement
  const app = document.querySelector("#app") as HTMLDivElement;
  app.innerHTML = list
    .map((item) => `次数：${item.count}，时间：${item.time}`)
    .join("<br/>");
};

render();

/*
  学习目标：在浏览器中运行, 并且修复遇到的问题
  步骤：
     1. tsc 编译ts为js
     2. 新建html, 引入编译后的js
     3. 运行, 修复问题
*/
